.navBox {
  min-height: 100%;
	min-width: 208px;
  background: var(--color-nav-bg) !important;
	color: var(--color-menu-not-selected) !important;
	:global {
		.ant-menu-item, .ant-menu-item-group-title, .ant-menu-item>a, .ant-menu-item>span>a {
			color: var(--color-menu-not-selected) !important;
			height: 48px !important;
			line-height: 48px !important;
		}
		.ant-menu-submenu-open {
			background-color: var(--color-black) !important;
		}
		.ant-menu-item.ant-menu-item-only-child, .ant-menu-submenu-title {
			padding-left: 32px !important;
		}

		.ant-menu-sub {
			.ant-menu-item.ant-menu-item-only-child {
				padding-left: 56px !important;
				position: relative;
				&::before {
					content: '';
					display: none;
					width: 7px;
					height: 7px;
					background: var(--color-white);
					position: absolute;
					left: 34px;
					border-radius: 50%;
					top: 21px;
				}
				&:hover {
					color: var(--color-white) !important;
					a {
						color: var(--color-white) !important;
					}
					&::before {
						display: inline-block;
					}
				}
				&.ant-menu-item-selected {
					background-color: var(--color-black) !important;
					color: var(--color-white) !important;
					a {
						color: var(--color-white) !important;
					}
					&::before {
						display: inline-block;
					}
				}
			}
		}
		.ant-menu-item.ant-menu-item-only-child {
			&:hover {
				color: var(--color-white) !important;
				a {
					color: var(--color-white) !important;
				}
			}
			&.ant-menu-item-selected {
				background-color: var(--color-black) !important;
				color: var(--color-white) !important;
				a {
					color: var(--color-white) !important;
				}
			}
		}
	}
}
